<!DOCTYPE html>
<html lang="zh_cn">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- CSS only -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
    <title>Document</title>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-sm-1 col-md-1 col-lg-2 col-xl-3 col-xxl-4"></div>
            <div class="col-sm-10 col-md-10 col-lg-8 col-xl-6 col-xxl-4">
                <div style="margin: 20px 0;"></div>
                <h2 style="font-weight: bold;">正在发生的事件</h2>
                <hr>
                <!-- <p class="text-secondary">2021/02/17 22:41:32 (UTC+08:00)</p> -->
                <!-- <div style="margin: 20px 0;"></div> -->
                <h5>暂无</h5>
                
                <div style="margin: 20px 0;"></div>
                <h2 style="font-weight: bold;">已经过去的事件</h2>
                <hr>
                <div class="card">
                    <!-- <h5 class="card-header">渗透</h5> -->
                    <div class="card-body">
                        <h4 class="card-title" style="font-weight: bold;">
                            <span class="badge bg-primary">正常</span>
                            Iriscafe-EPS-01
                        </h4>
                        <span class="card-text">当前状态: 
                            <span class="text-success" style="font-weight: bold;">
                                <span> 正常</span>
                            </span>
                            
                        </span>
                        <span style="margin: 0 5px;"></span>
                        <span class="card-text">
                            <i class="bi bi-hdd-stack-fill"></i>
                            可用性: 
                            <span class="text-success" style="font-weight: bold;">76.3%</span>
                        </span>

                        <div style="margin: 20px 0;"></div>
                        <hr>
                        <h5>状态更新</h5>
                        <div class="alert alert-danger" role="alert">
                            2021/02/17 22:41:32 (UTC+08:00) <br><b>渗透攻击开始</b>
                        </div>

                        <div class="alert alert-danger" role="alert">
                            2021/02/18 04:53:14 (UTC+08:00) <br><b>攻击威胁等级提升为一级</b>
                        </div>

                        <div class="alert alert-info" role="alert">
                            2021/02/19 15:08:56 (UTC+08:00) <br><b>攻击初步停止</b>
                        </div>

                        <div class="alert alert-success" role="alert">
                            2021/02/19 21:51:02 (UTC+08:00) <br><b>警报解除</b>
                        </div>

                        <!-- <button type="button" class="btn btn-success" style="width: 100%;">为服务器加油</button> -->
                    </div>
                </div>
            </div>
            <div class="col-sm-1 col-md-1 col-lg-2 col-xl-3 col-xxl-4"></div>
        </div>
    </div>

    
</body>

<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script>

</html>